// 获取默认attrs
import { getDefaultAttrs } from './defaultAttrs.js';
// 获取子组件
import { getChild } from './slots.js';
// 导出新组件
export default {
  props: ['value', 'elName', 'options', 'disabled'],
  name: 'el-component',
  render(h) {
    const self = this;
    const slots = Object.keys(this.$slots)
      .reduce((arr, key) => arr.concat(this.$slots[key]), [])
      .map(vnode => {
        vnode.context = this._self;
        return vnode;
      });
    // 获取子组件,如果有的话
    const child = getChild(this.elName, h, this.options);
    // 获取事件监听
    const events = this.$attrs.on || {};
    // 渲染函数中没有与 v-model 的直接对应——必须自己实现相应的逻辑
    events['input'] = function(event) {
      self.$emit('input', event);
    };
    // 参数传进来的attrs
    const attrsinset = this.$attrs.attrs || {};
    // 默认的attrs
    const defaultAttrs = getDefaultAttrs(this.elName);
    // 根据type渲染组件
    return h(
      `${this.elName}`,
      {
        on: events,
        props: {
          ...this.$props,
          ...attrsinset,
        },
        // 透传 scopedSlots
        scopedSlots: this.$scopedSlots,
        attrs: {
          ...attrsinset,
          ...defaultAttrs,
          disabled: this.disabled,
        },
      },
      [...slots, ...child],
    );
  },
};
